<!--
 * @Description: 墙布备料
 * 
 * @Author: XiongYaoYuan<xiongyaoyuan>
 * @Date: 2023-06-25 15:20:19
 * @FilePath: /yuxiuproweb/src/views/qb/preparation/tabs/curtain.vue
-->
<template>
  <div>
    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      @submit.native.prevent
    >
      <el-form-item label="订单号" prop="number">
        <el-input
          v-model="queryParams.number"
          filterable
          placeholder="请输入订单号"
          @keyup.enter.native="getList"
        ></el-input>
      </el-form-item>
      <el-form-item label="工单号" prop="workOrderNumber">
        <el-input
          v-model="queryParams.workOrderNumber"
          filterable
          placeholder="请输入工单号"
          @keyup.enter.native="getList"
        ></el-input>
      </el-form-item>
      <el-form-item label="型号" prop="modelNumber">
        <el-input
          v-model="queryParams.modelNumber"
          filterable
          placeholder="请输入型号"
          @keyup.enter.native="getList"
        ></el-input>
      </el-form-item>
      <el-form-item label="面料状态" prop="fabricType">
        <el-select
          style="width: 100%"
          v-model="queryParams.isShortage"
          placeholder="请选择面料状态"
          clearable
          @change="getList"
        >
          <el-option :label="'空'" value="6"></el-option>
          <el-option :label="'正常'" value="0"></el-option>
          <el-option :label="'绣花'" value="3"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="客户名称" prop="clientName">
        <el-select
          v-model="queryParams.clientName"
          clearable
          filterable
          placeholder="请选择客户"
          remote
          reserve-keyword
          :remote-method="getListClient"
          @change="getList"
        >
          <el-option
            v-for="item in clientList"
            :key="item.clientId"
            :label="item.clientName"
            :value="item.clientName"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="是否打印" prop="fabricType">
        <el-select
          style="width: 100%"
          v-model="queryParams.isPrint"
          placeholder="请选择是否打印"
          clearable
          @change="getList"
        >
          <el-option :label="'未打印'" value="0"></el-option>
          <el-option :label="'已打印'" value="1"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="打印日期" prop="printDateObj">
        <el-date-picker
          align="center"
          style="width: 240px"
          v-model="printDateObj"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="yyyy-MM-dd"
          format="yyyy-MM-dd"
          @change="getList"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="计划日期" prop="planeDateObj">
        <el-date-picker
          align="center"
          style="width: 240px"
          v-model="planeDateObj"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="yyyy-MM-dd"
          format="yyyy-MM-dd"
          @change="getList"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="getList"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
        <el-button-group style="margin-left: 10px">
          <el-button
            :type="!queryParams.accurate ? 'primary' : 'default'"
            @click="queryParams.accurate = false"
            size="mini"
            >模糊</el-button
          >
          <el-button
            :type="queryParams.accurate ? 'primary' : 'default'"
            @click="queryParams.accurate = true"
            size="mini"
            >精确</el-button
          >
        </el-button-group>
      </el-form-item>
    </el-form>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-printer"
          size="mini"
          @click="handlePrint"
          >打印</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-printer"
          size="mini"
          @click="handleXHPrint"
          >绣花打印</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-printer"
          size="mini"
          @click="cancelPrint"
          >取消打印</el-button
        >
      </el-col>
    </el-row>
    <el-table
      :data="list"
      :max-height="maxHeight"
      v-loading="loading"
      @selection-change="handleSelectionChange"
      show-summary
      :summary-method="getSummaries"
      :span-method="objectSpanMethod"
      border
      size="mini"
    >
      <el-table-column type="selection" width="55" align="center" fixed />
      <el-table-column align="center" label="ID" width="50">
        <template slot-scope="scope">
          {{ scope.$index + 1 }}
        </template>
      </el-table-column>
      <template v-for="(i, index) in tableForm.item">
        <el-table-column
          :key="index"
          :prop="i.itemcode"
          :columnKey="i.itemcode"
          :label="i.itemname"
          :align="i.aligntype ? i.aligntype : 'center'"
          :width="!!i.width ? i.width : ''"
          :min-width="i.minwidth"
          :show-overflow-tooltip="i.overflow ? true : false"
          :sortable="i.sortable ? true : false"
          :fixed="i.fixed"
          v-if="i.displaymark ? true : false"
        >
          <template slot-scope="scope">
            <div v-if="i.itemcode == 'technology'">
              <span v-if="scope.row[i.itemcode] == 0">冷胶</span>
              <span v-else-if="scope.row[i.itemcode] == 1">热胶</span>
              <span v-else-if="scope.row[i.itemcode] == 3">先冷后热</span>
              <span v-else>无工艺</span>
            </div>
            <div v-else-if="i.itemcode == 'fabricType'">
              <span v-if="scope.row[i.itemcode] == '1'">素布</span>
              <span v-if="scope.row[i.itemcode] == '2'">绣花</span>
            </div>
            <div v-else-if="i.itemcode == 'isShortage'">
              <span v-if="scope.row[i.itemcode] == 0">正常</span>
              <span v-if="scope.row[i.itemcode] == 1">欠料</span>
              <span v-if="scope.row[i.itemcode] == 2">零裁</span>
              <span v-if="scope.row[i.itemcode] == 3">绣花</span>
              <span v-if="scope.row[i.itemcode] == 4">绣花欠料</span>
              <span v-if="scope.row[i.itemcode] == 5">包板</span>
              <span v-if="scope.row[i.itemcode] == 6">空</span>
            </div>
            <div v-else-if="i.itemcode == 'isPrint'">
              <span v-if="scope.row[i.itemcode] == '1'">已打印</span>
              <span v-else></span>
            </div>
            <span v-else>{{ scope.row[i.itemcode] }}</span>
          </template>
        </el-table-column>
      </template>
    </el-table>
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
      :page-sizes="[10, 15, 100, 500]"
    />
    <!-- 打印 -->
    <print-view
      v-if="print.show"
      :show.sync="print.show"
      v-bind="print"
      @getList="getList"
    ></print-view>
    <!-- 打印 -->
    <xhprintView
      v-if="xhprint.show"
      :show.sync="xhprint.show"
      v-bind="xhprint"
      @getList="getList"
    ></xhprintView>
  </div>
</template>

<script>
import { qbProductList, getcl } from "@/api/asc/preparation";
import { listClient, getClient } from "@/api/mes/md/client";
import PrintView from "../mods/print.vue";
import xhprintView from "../mods/xhprint.vue";
import commonMix from "@/utils/mixins/common";
import { tableList } from "../mods/tablecolums.js";
import { updateTaskOrder } from "@/api/qb";
export default {
  mixins: [commonMix],
  components: {
    PrintView,
    xhprintView,
  },
  data() {
    return {
      queryParams: {
        pageNum: 1,
        pageSize: 100,
        modelNumber: "",
        clientName: "",
        workOrderNumber: "",
        number: "",
        fabricType: "",
        accurate: false,
        isPrint: "",
      },
      printDateObj: [],
      planeDateObj: [],
      total: 0,
      loading: false,
      list: [],
      selRows: [],
      clientList: [],
      print: {
        show: false,
        type: "0",
        data: null,
      },
      xhprint: {
        show: false,
        type: "0",
        data: null,
      },
      tableForm: tableList,
    };
  },
  created() {
    this.getList();
  },
  methods: {
    getList() {
      this.loading = true;
      const params = {
        ...this.queryParams,
        startPrintTime: this.printDateObj?.[0] || null,
        endPrintTime: this.printDateObj?.[1] || null,
        startIntendedDate: this.planeDateObj?.[0] || null,
        endIntendedDate: this.planeDateObj?.[1] || null,
      };
      qbProductList(params).then((res) => {
        if (res.code == 200) {
          this.list = this.getSpanArr(res.rows, "modelNumber", "dealRowSpan");
          this.loading = false;
          this.total = res.total;
        } else {
          this.$message.error(res.msg || "请求错误");
        }
      });
    },
    resetQuery() {
      this.resetForm("queryForm");
      this.planeDateObj = [];
      this.printDateObj = [];
      this.getList();
    },
    // 打印
    handlePrint() {
      if (this.selRows.length == 0) {
        this.$message.error("请勾选打印内容");
        return;
      }
      this.print = {
        show: true,
        type: "0",
        data: this.selRows,
      };
    },
    // 绣花打印
    handleXHPrint() {
      if (this.selRows.length == 0) {
        this.$message.error("请勾选打印内容");
        return;
      }
      this.xhprint = {
        show: true,
        type: "0",
        data: this.selRows,
      };
    },
    handleSelectionChange(selection) {
      this.selRows = selection;
    },
    handlecl() {
      this.loading = true;
      getcl().then((res) => {
        // this.list = res.data || [];
        // this.loading = false;
        console.log(res);
      });
    },
    getListClient(clientName = "") {
      listClient({
        pageNum: 1,
        pageSize: 100,
        enableFlag: "Y",
        clientName,
        // id: "1107",
      }).then(({ rows }) => {
        this.clientList = rows;
      });
    },
    getSummaries(param) {
      const { columns, data } = param;
      var arr = ["length"];
      const sums = [];
      columns.forEach((column, index) => {
        var bor = false;
        if (
          arr.length > 0 &&
          arr.find((item) => item == column.property) != undefined
        ) {
          bor = true;
        }
        if (index === 2) {
          sums[index] = "合计";
        } else {
          const values = data.map((item) => Number(item[column.property]));
          if (!values.every((value) => isNaN(value)) && bor) {
            sums[index] = Number(
              values
                .reduce((prev, curr) => {
                  const value = Number(curr);
                  if (!isNaN(value)) {
                    return prev + curr;
                  } else {
                    return prev;
                  }
                }, 0)
                .toFixed(2)
            );
          }
        }
      });
      return sums;
    },

    getSpanArr(list, code, rowSpan) {
      // // 数组重排序
      // list = list.sort(function (a, b) {
      //   var x = a[code];
      //   var y = b[code];
      //   return x > y ? -1 : x < y ? 1 : 0;
      // });
      let arrZero = [];
      let Datas = [];
      // 判断需要合并的行数
      for (var i = 0; i < list.length; i++) {
        var item = list[i];
        let RowSpanNum = 1;
        for (let j = i + 1; j < list.length; j++) {
          if (item[code] == list[j][code]) {
            arrZero.push(j);
            RowSpanNum++;
          } else {
            break;
          }
        }
        if (arrZero.findIndex((ele) => ele == i) != -1) {
          RowSpanNum = 0;
        }
        Datas.push({
          ...item,
          [rowSpan]: RowSpanNum,
        });
      }
      return Datas;
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (column.columnKey == "modelNumber") {
        return {
          rowspan: row.dealRowSpan,
          colspan: 1,
        };
      }
    },
    async cancelPrint() {
      let promiseList = [];
      for (var i = 0; i < this.selRows.length; i++) {
        var item = this.selRows[i];
        var that = this;
        let promise = new Promise((resolve, reject) => {
          item.isPrint = 0;
          item.printTime = "";
          updateTaskOrder(item)
            .then(({ data }) => {
              resolve(res || "操作成功");
            })
            .catch((er) => {
              reject("操作失败");
            });
        });
        promiseList.push(promise);
      }
      await Promise.all(promiseList)
        .then((res) => {
          this.$modal.msgSuccess(res.msg || "操作成功");
          this.haveopen.show = false;
        })
        .catch((er) => {})
        .finally(() => {
          this.getList();
        });
    },
  },
};
</script>
